From 71d133bb1c73031abbf4869bdd938e583b397773 Mon Sep 17 00:00:00 2001
From: Armand Philippot <git@armandphilippot.com>
Date: Tue, 4 Jan 2022 17:13:37 +0100
Subject: refactor: move Prism hook from layout to article page

I will not use Prism elsewhere, so it makes more sense to call Prism
only inside articles.
---
 src/pages/article/[slug].tsx | 17 +++++++++++++++++
 1 file changed, 17 insertions(+)

(limited to 'src/pages/article/[slug].tsx')

diff --git a/src/pages/article/[slug].tsx b/src/pages/article/[slug].tsx
index 54391fc..493f061 100644
--- a/src/pages/article/[slug].tsx
+++ b/src/pages/article/[slug].tsx
@@ -5,14 +5,19 @@ import PostFooter from '@components/PostFooter/PostFooter';
 import PostHeader from '@components/PostHeader/PostHeader';
 import Sharing from '@components/Sharing/Sharing';
 import ToC from '@components/ToC/ToC';
+import { config } from '@config/website';
 import { t } from '@lingui/macro';
 import { getAllPostsSlug, getPostBySlug } from '@services/graphql/queries';
 import { NextPageWithLayout } from '@ts/types/app';
 import { ArticleProps } from '@ts/types/articles';
 import { loadTranslation } from '@utils/helpers/i18n';
+import { addPrismClasses, translateCopyButton } from '@utils/helpers/prism';
 import { GetStaticPaths, GetStaticProps, GetStaticPropsContext } from 'next';
 import Head from 'next/head';
+import { useRouter } from 'next/router';
+import Prism from 'prismjs';
 import { ParsedUrlQuery } from 'querystring';
+import { useEffect } from 'react';
 
 const SingleArticle: NextPageWithLayout<ArticleProps> = ({ post }) => {
   const {
@@ -27,6 +32,18 @@ const SingleArticle: NextPageWithLayout<ArticleProps> = ({ post }) => {
     title,
   } = post;
 
+  const router = useRouter();
+  const locale = router.locale ? router.locale : config.defaultLocale;
+
+  useEffect(() => {
+    addPrismClasses();
+    Prism.highlightAll();
+  });
+
+  useEffect(() => {
+    translateCopyButton(locale);
+  }, [locale]);
+
   return (
     <>
       <Head>
-- 
cgit v1.2.3

